<template>
  <el-dialog
    draggable
    overflow
    :title="titleMap[mode]"
    v-model="visible"
    :width="600"
    destroy-on-close
    @closed="$emit('closed')"
  >
    <el-form
      :model="form"
      :rules="rules"
      ref="dialogForm"
      label-width="70px"
      label-position="right"
    >
      <el-row v-if="show">
        <el-col :span="8">
          <el-form-item label="内唛" prop="inside_barcode_id">
            <skAutoChoose
              v-model="main.inside_barcode.name"
              :name="'barcode'"
              :asKey="'inside_barcode_id'"
              :prepend_width="'30px'"
              :asValue="'0'"
              :assign="main"
            >
              <template #append>
                <RouterLink
                  target="_blank"
                  :to="{
                    name: 'designerBarcode',
                    query: { id: main.outside_barcode.id },
                  }"
                >
                  <el-button type="warning" icon="ElIconEdit" /></RouterLink
              ></template>
            </skAutoChoose>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="外唛" prop="outside_barcode_id">
            <skAutoChoose
              v-model="main.outside_barcode.name"
              :name="'barcode'"
              :asKey="'outside_barcode_id'"
              :assign="main"
              :asValue="'0'"
              :prepend_width="'30px'"
            >
              <template #append>
                <RouterLink
                  target="_blank"
                  :to="{
                    name: 'designerBarcode',
                    query: { id: main.outside_barcode.id },
                  }"
                >
                  <el-button type="warning" icon="ElIconEdit"
                /></RouterLink>
              </template>
            </skAutoChoose>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="验小数" prop="check_formatter_id">
            <skDicSelect
              v-model="main.check_formatter_id"
              :code="'formatterNumber'"
            ></skDicSelect>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="标签品名" prop="label_material">
            <el-input v-model="form.label_material"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="标签颜色" prop="label_color">
            <el-input v-model="form.label_color"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="验单位" prop="check_unit_id">
            <skDicSelect v-model="main.check_unit_id" :code="'unitMM'"></skDicSelect>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="订单号" prop="form.cust_order">
            <el-input v-model="form.cust_order"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="加工类别" prop="craft_category_id">
            <skDicSelect
              v-model="form.craft_category_id"
              :code="'CraftCategory'"
            ></skDicSelect>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="底布" prop="backing_category_id">
            <skAutoChoose
              v-model="form.backing_category.name"
              :name="'backing_category'"
              :asKey="'backing_category_id'"
              :assign="form"
            >
            </skAutoChoose>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="膜型号" prop="material_comp">
            <skDicSelect v-model="form.material_comp" :code="'FilmType'"></skDicSelect>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="膜类别" prop="material_batch">
            <skDicSelect v-model="form.material_batch" :code="'FilmSpec'"></skDicSelect>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="膜颜色" prop="film_category_id">
            <skDicSelect
              v-model="form.film_category_id"
              :code="'FilmCategory'"
            ></skDicSelect>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="客户品名" prop="custno">
            <el-input v-model="form.custno"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="客户颜色" prop="color_name">
            <el-input v-model="form.color_name"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="缸号" prop="dyelot">
            <el-input v-model="form.dyelot"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="批号" prop="lotname">
            <el-input v-model="form.lotname"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="成品门幅" prop="width">
            <el-input v-model="form.width"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="成品克重" prop="weight">
            <el-input v-model="form.weight"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="成分" prop="materialcf">
            <el-input v-model="form.materialcf"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="备忘录" prop="selfremark">
            <el-input v-model="form.selfremark"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="检验要求(检验显示)" prop="remark">
            <el-input v-model="form.remark"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <sk-tabs type="border-card">
        <el-tab-pane ref="tab" label="款号">
          <sc-VxeTable
            ref="xGrid1"
            :gridEvts="gridEvents"
            :gridOps="gridOps"
            :data="form.customer_style"
            :tablecode="'market_customer_style'"
          >
          </sc-VxeTable> </el-tab-pane
      ></sk-tabs>
    </el-form>
    <template #footer>
      <el-button @click="visible = false">取 消</el-button>
      <el-button type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
    </template>
  </el-dialog>
</template>

<script>
import skDicSelect from "@/components/skDicSelect";
import linkmanAdd from "./linkmanAdd";
import skAutoChoose from "@/components/skAutoChoose";
export default {
  emits: ["success", "closed"],
  components: { skDicSelect, skAutoChoose, linkmanAdd },
  data() {
    return {
      mode: "edit",
      gridEvents: {},
      gridOps: {
        height: 300,
      },
      show: false,
      titleMap: {
        add: "新增编辑",
        edit: "新增编辑",
      },
      main: { outside_barcode: {}, inside_barcode: {} },
      form: {
        craft_category_id: 0,
        backing_category: {},
        id: 0,
        customer_style: [],
      },
      rules: {},
      visible: false,
      isSaveing: false,
    };
  },
  mounted() {},
  methods: {
    //显示
    open(mode = "add") {
      this.mode = mode;
      this.visible = true;

      return this;
    },

    //表单提交方法
    async submit() {
      this.isSaveing = true;
      this.form["main"] = this.main;
      var res = await this.$API.market.customerStorage.saveStyle.post(this.form);
      this.isSaveing = false;
      if (res.code == 200) {
        this.$emit("success", this.form, this.mode);
        this.visible = false;
        this.$message.success("操作成功");
      }
    },
    async getItems(id) {
      var res = await this.$API.market.customerStorage.getStyle.get({
        filter: [{ order_id: id }],
      });
      if (res.code == 200) {
        this.form.customer_style = res.data.rows;
      }
    },
    async getmain(id) {
      this.$API.market.customerStorage.list.get({ id: id }).then(res => {
        let data = res.data.rows[0];

        Object.assign(this.form, this.$TOOL.removeNull(data));
        Object.assign(this.main, this.$TOOL.removeNull(data.main));
        this.getItems(data.id);
        this.show = true;
      });
    },
    //表单注入数据
    setData(data) {
      if (data.length == 1) {
        this.getmain(data[0].id);
      } else {
        this.form.ids = data.map(v => v.id);
      }
    },
  },
};
</script>
